<!-- 节假日管理 -->
<style lang="less">
.vacation {
  margin: 15px;
  #container {
    width: 1000px;
    height: 700px;
    position: absolute;
    top: 150px;
    left: 300px;
  }
  .pink {
    background: #fff0f0;
    border: 1px solid #fff0f0;
  }
  .white {
    background: white !important;
  }
  .blue {
    background: #addfff;
    border: 1px solid #addfff;
  }
}
@media screen and (max-width: 1600px) {
  .vacation {
    #container {
      left: 15%;
    }
  }
}
@media screen and (max-width: 1400px) {
  .vacation {
    #container {
      left: 10%;
    }
  }
}
</style>


<template>
  <div class="vacation">
    <Card :bordered="false">
      <p slot="title">综合配置 > <span class="select-font">节假日管理</span></p>
      <div>
        <Button type="info"
                @click.native="uploadMu">下载假日模板</Button>
        <Button type="primary"
                @click.native="addReady">导入假日</Button>
      </div>
    </Card>
    <div id="container">

    </div>
    <Modal v-model="daoruModal"
           title="导入假日"
           width="800">
      <Upload multiple
              type="drag"
              :format="['xls']"
              :on-success="handleSuccess"
              :on-error="handleError"
              :max-size="20480"
              :on-exceeded-size="handleMaxSize"
              :on-format-error="handleFormatError"
              :before-upload="handleBeforeUpload"
              :action="daoruUrl">
        <div style="padding: 20px 0">
          <Icon type="ios-cloud-upload"
                size="52"
                style="color: #3399ff"></Icon>
          <p>上传节假日</p>
        </div>
      </Upload>
    </Modal>
  </div>
</template>


<script>
import 'static/css/simple-calendar.css';
import { SimpleCalendar } from 'common/js/simple-calendar.js';
import { ajaxPost } from 'global/axios';
import storage from 'good-storage';
import { domain2 } from 'global/setting';
export default {
  data() {
    return {
      holidayNew: '/sys/holiday/typeadd',
      holidayList: '/sys/holiday/list',
      workday: [],
      holiday: [],
      daoruModal: false,
      daoruUrl: '',
    };
  },
  methods: {
    handleMaxSize(file) {
      this.$Notice.warning({
        title: '超出文件大小限制',
        desc: `文件太大，不能超过 20M。`,
      });
    },
    uploadMu() {
      window.open(
        'https://hezhangzhi.gd-gy.com.cn/home/swproject/template/holiday.xls'
      );
    },
    addReady() {
      this.daoruModal = true;
      $('.ivu-upload-list').html('');
    },
    getHoliday() {
      let params = {
        data: {},
        url: this.holidayList,
        token: storage.session.get('token'),
        success: res => {
          this.$Loading.finish();
          let rili_year = $('.sc-select-year').val();
          let rili_month = $('.sc-select-month').val();
          if (rili_month < 10) {
            rili_month = `0${rili_month}`;
          }
          res.data.result.result.map(item => {
            let year = item.date.substring(0, 4);
            let month = item.date.substring(5, 7);
            let day = item.date.substring(8, 10);
            if (year == rili_year && month == rili_month) {
              $('.sc-item').each(function (index, items) {
                let days = $(items).children('.day').text();
                if (days < 10) {
                  days = `0${days}`;
                }
                if (days == day) {
                  if (item.status === '1') {
                    $(items).addClass('pink');
                  } else if (item.status === '2') {
                    $(items).addClass('blue');
                  }
                }
              });
            }
          });
        },
      };
      ajaxPost(params);
    },
    handleFormatError(file) {
      this.$Notice.warning({
        title: '文件格式不正确',
        desc: `文件格式不正确，请上传 xls 格式的excel。`,
      });
    },
    handleSuccess(res) {
      if (res.code === '0000') {
        this.getHoliday();
        this.$Message.success({
          content: '上传成功',
        });
        this.daoruModal = false;
      } else {
        this.$Message.warning({
          content: res.message,
        });
      }
    },
    handleError() {
      this.$Message.warning({
        content: '导入失败，请检查格式',
      });
    },
    handleBeforeUpload() {
      this.$Message.warning({
        content: '本次上传将会覆盖旧的假日安排，请确保旧的假日安排已失效',
      });
    },
  },
  mounted() {
    this.daoruUrl = `${domain2}/riverchief/sys/holiday/new?token=${storage.session.get(
      'token'
    )}`;
    let myCalendar = new SimpleCalendar('#container');
    this.getHoliday();
    let that = this;
    $('.sc-othermenth').addClass('white');
    $('.sc-select-year').change(function () {
      setTimeout(function () {
        $('.sc-othermenth').addClass('white');
        that.getHoliday();
      }, 50);
    });
    $('.sc-select-month').change(function () {
      setTimeout(function () {
        $('.sc-othermenth').addClass('white');
        that.getHoliday();
      }, 50);
    });
    $('.sc-yleft').click(function () {
      setTimeout(function () {
        $('.sc-othermenth').addClass('white');
        that.getHoliday();
      }, 50);
    });
    $('.sc-yright').click(function () {
      setTimeout(function () {
        $('.sc-othermenth').addClass('white');
        that.getHoliday();
      }, 50);
    });
    $('.sc-mleft').click(function () {
      setTimeout(function () {
        $('.sc-othermenth').addClass('white');
        that.getHoliday();
      }, 50);
    });
    $('.sc-mright').click(function () {
      setTimeout(function () {
        $('.sc-othermenth').addClass('white');
        that.getHoliday();
      }, 50);
    });
    $('.sc-return-today').click(function () {
      setTimeout(function () {
        $('.sc-othermenth').addClass('white');
        that.getHoliday();
      }, 50);
    });
  },
};
</script>
